<html>
<head>
<title>在线预订</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport"
	content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet" href="wx_assets/css/product.css?v=2013-11-24" />
<script type='text/javascript' src='wx_assets/js/jquery-1.7.1.min.js'></script>
<script src="http://res.wx.qq.com/mmbizwap/en_US/htmledition/js/wxm-core1530d0.js"></script>
<script type='text/javascript' src="wx_assets/js/alert.js"></script>
<style type="text/css">
	.page-url {
		text-align: center;
		font-size:12px;
	}
</style>
</head>

<body id="onlinebooking">
	<div class="qiandaobanner">
		<img src="wx_assets/images/store/headLogo.jpg" />
	</div>
	<div class="cardexplain">
	<notempty name="reserveCount">
		<ul class="round">
			<li>
				<a href='javascript:void(0)' onclick="getReserveList()">
				<span class="arrow">我的预订<em class="ok">{$reserveCount}</em></span>
				</a>
			</li>
		</ul>
	</notempty>
	
		<notempty name="storeTip">
			<ul class="round">
				<li>
					<h2>预订说明</h2>
					<div class="text">
						{$storeTip}
					</div>
				</li>
			</ul>
		</notempty>
		<!--后台可控制是否显示-->
		<!-- 
		<ul class="round">
			<li class="addr">
				<a href="#"><span>深圳市福田区深南路本元大厦16B</span></a>
			</li>
			<li class="tel">
				<a href="tel:0755-88308939">
					<span>0755-88308939 预约电话</span>
				</a>
			</li>
		</ul>
		 -->
		<empty name="resources">
		<ul class="round">
				<li>
					<h2>提示</h2>
					<div class="text">
						桌位/包间 预订已满，请选择其他时间日期
					</div>
				</li>
			</ul>
		</empty>
		<notempty name="resources">
		
		<!--粉丝填写过的信息的，直接就显示名字电话，粉丝没有填写过信息的话，这里就直接留空让粉丝填写-->
		<ul class="round">
			<li class="title mb"><span class="none">请填写预订信息</span></li>
			<li class="nob">
				<table width="100%" border="0" cellspacing="0" cellpadding="0"
					class="kuang">
					<tr>
						<th>联系人</th>
						<td><input name="truename" type="text" class="px"
							id="truename" value="{$fullName}" placeholder="请输入您的姓名"></td>
						
					</tr>
				</table>
			</li>
			<li class="nob">
				<table width="100%" border="0" cellspacing="0" cellpadding="0"
					class="kuang">
					<tr>
						<th>联系电话</th>
						<td><input name="tel" class="px" id="tel" value="{$phone}"
							type="text" placeholder="请输入您的电话"></td>
					</tr>
				</table>
			</li>
			
			
			<li class="nob">
				<table width="100%" border="0" cellspacing="0" cellpadding="0"
					class="kuang">
					<tr>
						<th>桌位/包间</th>
						<td><select name="select1" class="dropdown-select" id="select1">
							<option value="">请选择...</option>
							<volist name="resources" id="res">
								<option value="{$res.id}">{$res.name}</option>
							</volist>
						</select></td>
					</tr>
				</table>
			</li>
			
			<li class="nob">
				<table width="100%" border="0" cellspacing="0" cellpadding="0"
					class="kuang">
					<tr>
						<th>到店时间</th>
						<td>
						<select name="reservehtime" class="dropdown-select" id="reservehtime">
							<volist name="reservehtimes" id="htime">
								<option value="{$htime.time}">{$htime.time}</option>
							</volist>
						</select>
						</td>
						<th style="width:25px;">&nbsp;时</th>
						<td>
						<select name="reserveitime" class="dropdown-select" id="reserveitime">
							<volist name="reserveitimes" id="itime">
								<option value="{$itime.time}">{$itime.time}</option>
							</volist>
						</select>
						</td>
						<th style="width:25px;">&nbsp;分</th>
					</tr>
				</table>
			</li>

			<li class="nob">
				<table width="100%" border="0" cellspacing="0" cellpadding="0"
					class="kuang">
					<tr>
						<th valign="top" class="thtop">备注</th>
						<td><textarea name="info" class="pxtextarea"
								style="height: 99px; overflow-y: visible" id="info"
								placeholder="请输入备注信息"></textarea></td>
					</tr>
				</table>
			</li>
		</ul>

		<div class="footReturn">
			<input type="button" id="showcard" class="submit" value="提交预订" />
			<div class="window" id="windowcenter">
				<div id="title" class="wtitle">
					操作提示<span class="close" id="alertclose"></span>
				</div>
				<div class="content">
					<div id="txt"></div>
				</div>
			</div>
		</div>
		</notempty>
	</div>
<script type="text/javascript"> 

var hrefParamsArray = GetSessionIdFromHref(window.location.search);

function GetSessionIdFromHref(search){
　　	var args = search.substring(1); 
　　	var retval = new Array(); 
	args = args.split("&"); 
		for(var i = 0; i < args.length; i ++){ 
			str = args[i]; 
			var arg = str.split("="); 
			if(arg.length <= 1) continue; 
			if(arg[0] == 'params') {
				var params = decodeURIComponent(arg[1]);
				var obj = eval('(' + params + ')');
				retval["id"] = obj.id;
				retval["personCount"] = obj.personCount;
				retval["reserveDate"] = obj.reserveDate;
				retval["reserveType"] = obj.reserveType;
			}else if(arg[0] == 'customerId') {
				retval["customerId"] = arg[1]; 
			}else if(arg[0] == 'userName'){
				retval["userName"] = arg[1]; 
			}
		} 
		return retval; 
}

		var resources = {$resources}+"";
		var oLay = document.getElementById("overlay");	
		$(document).ready(function () { 
			$("#showcard").click(function () {
				if(resources== ''){
					alert('桌位/包间 预订已满，请选择其他时间日期');
					return;
				}
				
				if($("#tel").val()==''){alert('电话不能为空');return;} 
				if($("#truename").val()==''){alert('名字不能为空');return;} 
				if(resources!= '' && $('#select1').val()==''){
					alert('请选择桌位/包间');
					return;
					}
				
				 var reserveDate = hrefParamsArray["reserveDate"];
				 var reserveHTime = $('#reservehtime').val();
				 var reserveITime = $('#reserveitime').val();
				 if(reserveHTime != '' && reserveITime != '' ){
				 	reserveTime = reserveDate +" " + reserveHTime +":"+reserveITime ;
					 
				 }else if(reserveHTime != ''){
					 reserveTime = reserveDate +" " + reserveHTime +":00:00" ;
				 }else{
					 reserveTime = reserveDate ;
				 }

				$("#showcard").val("提交中...");
				$("#showcard").attr("disabled", true);
				
				var baseUrl =  '{$Think.config.SERVER_HOST}';
				var urlString = baseUrl + 'call.json?customerId='+ hrefParamsArray["customerId"]+'&userName='+hrefParamsArray["userName"];
				var storeId = hrefParamsArray["id"];
				var personCount = hrefParamsArray["personCount"];
				
				var fullName = $('#truename').val();
				var phone = $('#tel').val();
				
				var remark = $('#info').val();
				var storeResourceBaseId;
				if(resources!= '' ){
					storeResourceBaseId= $('#select1').val();
				}
				
				var reserveType = hrefParamsArray["reserveType"];
				
				$.ajax({url : urlString,
					dataType : "json",
					type : "post",
					data : {
						'module': 'store',
				        'method' : 'addReserve',
				        'params' : '{"storeId":' + storeId + ',"fullName":"' + fullName + '","phone":"' + phone + '","personCount":'+personCount+',"reserveTime":"'+reserveTime+'","reserveDate":"'+reserveDate+'","reserveType":"'+reserveType+'","storeResourceBaseId":'+storeResourceBaseId+',"remark":"'+remark+'"}'
					},
					success : function(data) {
					  	if (data['code'] == 505) {
	                        alert(data['msg']);
	                        return;
	                    } else {
	                    	var oid = data;
	                    	window.location.href = 'call.html?userName=' + hrefParamsArray['userName'] + '&customerId='
	                		+ hrefParamsArray['customerId'] + '&module=store&method=getStoreReserveOrderDetail&params={"id":' + oid + '}';
	                	
	                    	//window.location.reload();
	                    }
					},
					error : function() {
					}
				});
			
				}); 
			}); 
			
			$("#windowclosebutton").click(function () { 
				$("#windowcenter").slideUp(500);
				oLay.style.display = "none";
			}); 
			$("#alertclose").click(function () { 
				$("#windowcenter").slideUp(500);
				oLay.style.display = "none";
			}); 
		
			function alert(title){ 
				$("#windowcenter").slideToggle("slow"); 
				$("#txt").html(title);
				//$("#windowcenter").hide("slow"); 
				setTimeout('$("#windowcenter").slideUp(500)',4000);
			} 
			
			function getReserveList() {
				var baseUrl =  '{$Think.config.SERVER_HOST}';
				var urlString = baseUrl + 'call.html?customerId='+ hrefParamsArray["customerId"]+'&userName='+hrefParamsArray["userName"]
					+ "&module=store"; 
				
				urlString += "&method=getStoreReserveOrders&params={\"id\":" + hrefParamsArray["id"] + "}";
				location.href= urlString;
			}
	</script>
	
	<script>
	document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
		WeixinJSBridge.call('showOptionMenu');
		});
		
		function report(link, fakeid, action_type){
		    var parse_link = parseUrl(link);
		    if(parse_link == null)
		    {
		      return ;
		    }
		    var query_obj = parseParams( parse_link['query_str'] );
		    query_obj['action_type'] = action_type;
		    query_obj['uin'] = fakeid;
		    var report_url = '/mp/appmsg/show?' + jQuery.param( query_obj );
		    jQuery.ajax({
		      url: report_url,
		      type: 'POST',
		      timeout: 2000
		    })
		 };
		 
		function share_scene(link, scene_type) {
			// Android无法会截取encode的参数，所以改用直接添加参数的方式
			var share_url = link + '&scene=' + scene_type;
			return share_url;
		};

		(function() {
			var desString ='帮我预订'+ "\n点击查看预订详情";
			var titleString = "在线预订";
			
		//	var search = resetHerf(window.location.search);
			var search = window.location.search;

			var onBridgeReady = function() {
			var link = window.location.protocol + "//"
						+ window.location.host + window.location.pathname + search;
		
				link = link.replace("{", "%7B");
				link = link.replace("}", "%7D");
				var appId = '', title = htmlDecode(titleString), desc = htmlDecode(desString),
				imgUrl = encodeURI('http://www.happyidea.com.cn/wx_assets/images/store/pagecount_main_bk.jpg'), fakeid = "Mjc2OTgzMTM1", desc = desc || link;

				// 发送给好友; 
				WeixinJSBridge.on('menu:share:appmessage', function(argv) {

					WeixinJSBridge.invoke('sendAppMessage', {
						"appid" : appId,
						"img_url" : imgUrl,
						"img_width" : "640",
						"img_height" : "640",
						"link" : share_scene(link, 1),
						"desc" : desc,
						"title" : title
					}, function(res) {
						report(link, fakeid, 1);
					});
				});
				// 分享到朋友圈;
				WeixinJSBridge.on('menu:share:timeline', function(argv) {
					report(link, fakeid, 2);
					WeixinJSBridge.invoke('shareTimeline', {
						"img_url" : imgUrl,
						"img_width" : "640",
						"img_height" : "640",
						"link" : share_scene(link, 2),
						"desc" : desc,
						"title" : title
					}, function(res) {
					});

				});

				// 分享到微博;
				var weiboContent = '';
				WeixinJSBridge.on('menu:share:weibo', function(argv) {

					WeixinJSBridge.invoke('shareWeibo', {
						"content" : title + share_scene(link, 3),
						"url" : share_scene(link, 3)
					}, function(res) {
						report(link, fakeid, 3);
					});
				});
				// 隐藏右上角的选项菜单入口;
				//WeixinJSBridge.call('hideOptionMenu');
			};
			if (document.addEventListener) {
				document.addEventListener('WeixinJSBridgeReady', onBridgeReady,
						false);
			} else if (document.attachEvent) {
				document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
				document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
			}
		})();
	</script>
	
</body>
</html>

